﻿@model WebShop.Models.ProductModel
        
<script type="text/javascript" src="@Url.Content("~/static/js/jquery.fancybox.js")"></script>
<link rel="stylesheet" type="text/css" href="@Url.Content("~/static/css/jquery.fancybox.css")" media="screen" />
<script type="text/javascript">
    $(document).ready(function () {
        $('a.fancybox').fancybox();
    });
</script>
<div class="row-fluid">

    <ul class="breadcrumb">
        <li>
            <i class="icon-chevron-left"></i> <a href="@Url.RouteUrl("Default", new RouteValueDictionary { { "controller", "index" }, { "action", "index" }})">@Model.Translate("main_page")</a>
        </li>
        @{
            int index1 = 1;
        }
        @foreach (var item in Model.Breadcrumbs)
        {
            <span class="divider">/</span>
            <li>
                <a href="@Url.RouteUrl("Category", new RouteValueDictionary { { "id", item.Id } })">@item.Name</a>
            </li>
        }

        <span class="divider">/</span>
        <li>
            <li class="active">@Model.Product.Name</li>
        </li>

    </ul>

    <div class="row">
        <div class="span3">&nbsp;</div>
        <div class="span9">
            <div class="product-photo">
                <a href="@Model.Product.Photo" class="thumbnail fancybox">
                    <img src="@Model.Product.Photo" alt="111"/>
                </a>
            </div>
            <div class="product-data">
                <h3>@Model.Product.Name</h3>
                <div class="product-price">
                    @String.Format(Model.Translate("price_{0}"), Model.Product.Price)
                </div>
                <div class="product-control">
                    <a href="@Url.RouteUrl("Default", new RouteValueDictionary { { "controller", "cart" }, { "action", "add" }, {"id", Model.Product.Id}})" class="btn btn-success"><i class="icon-shopping-cart icon-white"></i>@Model.Translate("checkout")</a>
                </div>
            </div>
        </div>
        <div class="span3">&nbsp;</div>
    </div>

    <div class="row">

        <div class="tabbable">
            <ul class="nav nav-tabs">
                <li class="active"><a href="#1" data-toggle="tab">@Model.Translate("about")</a></li>
                <li><a href="#2" data-toggle="tab">@Model.Translate("gallery")</a></li>
            </ul>
            <div class="tab-content">
                <div class="tab-pane active" id="1">
                    @Model.Product.Description
                </div>
                <div class="tab-pane product-gallery" id="2">
                    @foreach (string item in Model.Product.Gallery)
                    { 
                         <a href="@item" class="thumbnail fancybox">
                            <img src="@item" alt="" class="product-gallery-thumb"/>
                        </a>
                    }
                </div>
            </div>
        </div>

    </div>
</div>
